<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>axios常用配置解析</title>
    <script src="axios.js"></script>
</head>

<body>
<button>发送POST请求</button>
<script>
    const btn = document.querySelector('button')

    btn.addEventListener('click', function () {
        axios({
            //基础路径
            baseURL: "http://localhost:3000",
            //请求类型
            method: 'POST',
            //URL,如果有基础路径,就会自动进行拼接
            url: '/posts',
            //对请求数据进行处理,处理完的结果再像服务器进行发送
            // transformRequest: [
            //     function (data) {
            //         return data
            //     }
            // ],
            //对响应结果进行改变,再用自定义的回调处理改变后的结果
            transformResponse: [function (response) {
                return response;
            }],
            //对请求头信息进行配置
            headers: {
                'X-Request-With': 'XMLHttpRequest',
                'name': 'zyj',
                'age': 19
            },
            //设置url的参数
            params: {
                a: 100,
                b: 200
            },
            //设置请求体信息
            data: {
                "id": "3",
                "title": "add new title3",
                "views": 300
            },
            //超时时间
            timeout: 1000,
            //跨域请求时,对cookie的携带进行设置,false为不携带,true在跨域请求时把cookie携带过去
            withCredentials: false,
            //对响应体的格式进行设置
            responseType: 'json',
            //对响应结果的编码
            responseEncoding: 'utf8',


            //以上是常用的内容,更多内容参考axios的文档使用


        }).then(
            response => {
                console.log(response)
            }
        )
    })
</script>
</body>
</html>